<template>
  <!-- 弹窗中的 生产记录 -->
  <div class="production-record ">
    <div class="selectBar">
      <div class="pickTime">
        <!-- <el-date-picker
          v-model="dayTime"
          type="date"
          align="right"
          size="mini"
          value-format="yyyy-MM-dd"
          :clearable="false"
          :picker-options="pickerOptions"
          @change="timeChange"
        /> -->
        <date-range-picker
          @passDate="passAlarmDate"
          :clearbtn="false"
          :startTime="new Date(new Date()-6*24*3600000).toLocaleDateString()"
          :endTime="new Date().toLocaleDateString()"
        />
      </div>
      <div v-if="false" class="export-btn" @click="alarmExport">
        导出
      </div> 
    </div>
    <div class="table_data">
      <el-scrollbar style="height:100%">
        <el-table :data="tableData" stripe style="width: 100%" row-key="alarm_id">
          <el-table-column prop="create_time" label="执行日期" width="160"></el-table-column>
          <el-table-column prop="formula" label="配方编号" align="center">
          </el-table-column>
          <el-table-column prop="formula" label="产品名称" width="220">
            <template slot-scope="{row}">
              <div>
                <!-- {{row.formula}} -->
                {{COFFEE_TYPE[row.formula]}}
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="eTime" label="萃取时间(s)"></el-table-column>
          <el-table-column prop="pThickness" label="粉饼厚度"></el-table-column>
          <el-table-column prop="millTime" label="研磨时间(s)"></el-table-column>
          <el-table-column prop="water" label="水量"></el-table-column>
        </el-table>
      </el-scrollbar>
    </div>
    <pagina-tion
      v-show="total>=0"
      :background="true"
      :total="total"
      :offset.sync="offset"
      :limit.sync="limit"
      @pagination="getChangePage"
    />

  </div>
</template>

<script>
import { mapState } from 'vuex'
import {
  format
} from 'silly-datetime'
import * as api from '@/api'
import { project_id, limit } from '@/consts/consts'
import { dealStatusMap, except_levels, COFFEE_TYPE } from '@/consts/codeMaps'
import { downLoadFile, parseJson, disabledDate } from '@/utils/tool'

export default {
  data() {
    return {
      dateRange: [
        new Date(new Date()-6*24*3600000).toLocaleDateString(),
        new Date().toLocaleDateString()
      ],
      format,
      search: {
        branch_number: '',
        device_type: '',
        status: '',
        except_level: ''
      },
      branchList: [],
      deviceList: [],
      startdayTime: new Date(new Date()-6*24*3600000).toLocaleDateString(),
      enddayTime:new Date().toLocaleDateString(),
      pickerOptions: {
        disabledDate
      },
      total: 0,
      offset: 0,
      limit: 5,
      dealStatusMap,
      except_levels,
      tableData: [],
      alarm: {},
      dialog: {
        visible: false,
        info: {
          alarm: null
        }
      },
      COFFEE_TYPE
    }
  },
  computed: {
    ...mapState(['deviceDetail', 'dashtype'])
  },
  methods: {
    // 时间筛选
     passAlarmDate (args) {
      this.dateRange = args
      this.queryDeviceRt()
    },
    getStatus(status) {
      return dealStatusMap.find(item => item.key === status)
    },

    getChangePage(val) {
      this.offset = val.offset
      this.queryDeviceRt()
    },
     // 时间筛选
    // timeChange(val) {
    //   console.log('timeChange:', val)
    //   this.queryDeviceDay()
    // },

    openHandleAlarmDialog (alarm) {
      this.alarm = alarm
      this.dialog.alarm = alarm
      this.dialog.visible = true
    },


    async alarmExport() {
      const res = await api.alarmmanage.alarmExport({
        branch_number: this.$route.query.branch_number,
        time_start: this.dateRange[0],
        time_end: this.dateRange[1]
      })
      downLoadFile(res, '告警数据.xlsx')
    },



    // 6.17. 查询设备日报表
    async queryDeviceRt() {
      const [start = '', end = ''] = this.dateRange
      const { code, data, total } = await api.maxcompute.queryDeviceRt({
        offset: this.offset,
        limit: this.limit
      }, {
        dashtype: this.dashtype,
        serial: this.deviceDetail.serial,
        day_start: format(start, 'YYYY-MM-DD'),
        day_end: format(end, 'YYYY-MM-DD'),
        store_id: this.$route.query.branch_number
      })
      if (code === 0) {
        this.total = total
        this.tableData = data.map(item => {
          let obj = parseJson(item.data)
          return {
            create_time: format(item.create_time, 'YYYY-MM-DD HH:mm:ss'),
            ...obj
          }
        })
      }
    },

  },
  created() {
    this.queryDeviceRt()
  },
  mounted () {
    
  },
}
</script>

<style lang="stylus">
.production-record {
  .selectBar {
    height: 40px;
    flexMiddle(space-between);
  }
  .pickTime {
     width: 260px
  }
  .table_data {
    margin-top: getPx(15);
    height:getPx(300);
  }
}

</style>